﻿
//Funcion para Movilidad entre los Elemento
$(function () {
    $("#sortable").sortable();
    $("#sortable").disableSelection();
});
//Funcion para Agregar Opcion a RadioButton List
function agregarOpcionRadio(b) {
    var a = jQuery("#contador:hidden").val();
    
    a++;
    document.getElementById('contador').value = a;
    var elemento = '<div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div>';
    elemento += '<input type="radio" class="opcion"   name="edicion' + b + '" value="' + a + '"/>';
    elemento += '<label  id="radio' + a + '">Editar Opcion</label>'; //Label de Radio
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#radio' + a + '").editable();'; //Funcion Para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();})</script></div>'; //Funcion para Eliminar Elemento
    jQuery('#bloques' + b).append(elemento);


}

//Funcion para Agregar Opcion a CheckBox List
function agregarOpcionCheck(b) {
    var a = jQuery("#contador:hidden").val();

    a++;
    document.getElementById('contador').value = a;
    var elemento = '<div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div>';
    elemento += '<input type="checkbox"    name="edicion' + b + '" value="' + a + '"/>';
    elemento += '<label  id="radio' + a + '">Editar Opcion</label>'; //Label de CheckBox
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#radio' + a + '").editable();'; //Funcion Para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();})</script></div>'; //Funcion para Eliminar Elemento
    jQuery('#bloques' + b).append(elemento);
}

//Controles de Campos Disponibles
jQuery('#objeto1').live("click", function () {
    var elemento = '<div id="labelTitulo" class="etiqueta">Titulo:</div><input type="text" name="titulo" class="campoBajo"/>';
    elemento += '<img id="quitartitulo" width="18" height="16" src="../../Styles/Images/Delete.png"/>';
    elemento += '<script type="text/javascript">jQuery("#quitartitulo").live("click", function () {jQuery("#piezaz").remove();});</script>';
    jQuery('#sortable').append('<li id="piezaz">' + elemento + '</li>');
});

jQuery('#objeto2').live("click", function () {
    var elemento ='<div class="etiqueta">Alcance: </div><textarea  name="alcance" class="campoMedio"></textarea>';
    elemento += '<img id="quitaralcance" width="18" height="16" src="../../Styles/Images/Delete.png"/>';
    elemento += '<script type="text/javascript">jQuery("#quitaralcance").live("click", function () {jQuery("#piezaw").remove();});</script>';
    jQuery('#sortable').append('<li id="piezaw">' + elemento + '</li>');
});

jQuery('#objeto3').live("click", function () {
    var elemento = '<div class="etiqueta">Limitaciones:</div><textarea  name="limitaciones" class="campoMedio"></textarea>';
    elemento += '<img id="quitarlimitacion" width="18" height="16" src="../../Styles/Images/Delete.png"/>';
    elemento += '<script type="text/javascript">jQuery("#quitarlimitacion").live("click", function () {jQuery("#piezal").remove();});</script>';
    jQuery('#sortable').append('<li id="piezal">' + elemento + '</li>');
});

jQuery('#objeto4').live("click", function () {
    var elemento='<li><div class="etiqueta">Objetivos: </div><textarea  name="limitaciones" class="campoMedio"></textarea>';
    elemento += '<img id="quitarobjetivos" width="18" height="16" src="../../Styles/Images/Delete.png"/>';
    elemento += '<script type="text/javascript">jQuery("#quitarobjetivos").live("click", function () {jQuery("#piezao").remove();});</script>';
    jQuery('#sortable').append('<li id="piezao">' + elemento + '</li>');
});

//Control de Nuevo Campo de Texto

jQuery('#objeto5').live("click", function () {
    var a = jQuery("#contador:hidden").val();
    a++;
    document.getElementById('contador').value = a;
    var elemento = '<li id="pieza'+a+'"><div id="nuevo' + a + '" class="etiqueta">Click para Editar </div><input  name="edicion1" class="campoBajo"/>';
    elemento += '<img id="quitar'+a+'" width="18" height="16" src="../../Styles/Images/Delete.png"/></li>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#nuevo' + a + '").editable(); '; //Funcion Para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script>'; //Funcion para Eliminar Elemento
    jQuery('#sortable').append(elemento);
});

//Control de Nueva Lista de RadioButtons

jQuery('#objeto6').live("click", function () {
    var a = jQuery("#contador:hidden").val();
    a++;
    document.getElementById('contador').value = a;
    var b = jQuery("#contador:hidden").val();
    var elemento = '<div class="etiqueta-radio" id="nuevo' + a + '">Click para Editar </div>';
    elemento += '<img id="quitar' + b + '"  width="15" height="13" src="../../Styles/Images/Delete.png"/>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#nuevo' + a + '").editable();';
    elemento += 'jQuery("#quitar' + b + '").live("click", function () {jQuery("#pieza' + b + '").remove();});</script>'; //Funcion para Eliminar Elemento
    a++;
    document.getElementById('contador').value = a;
    //Opcion 1
    elemento += '<div class="bloques" id="bloques' + b + '"><div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div><input type="radio" class="opcion"   name="edicion' + b + '" value="' + a + '"/>';
    elemento += '<label  id="radio' + a + '">Editar Opcion</label>'; //Label de Radio
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/>'; //Boton para Eliminar Elemento
    elemento += '<br><script type="text/javascript"> jQuery("#radio' + a + '").editable();'; //Funcion Para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div>'; //Funcion para Eliminar Elemento
    a++;
    //Opcion 2
    elemento += '<div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div><input type="radio" class="opcion"   name="edicion' + b + '" value="' + a + '"/>';
    elemento += '<label  id="radio' + a + '">Editar Opcion</label>'; //Label de Radio
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/>'; //Boton para Eliminar Elemento
    elemento += '<br><script type="text/javascript"> jQuery("#radio' + a + '").editable();'; //Funcion Para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div>'; //Funcion para Eliminar Elemento
    a++;
    //Opcion 3
    document.getElementById('contador').value = a;
    elemento += '<div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div><input type="radio" class="opcion"   name="edicion' + b + '" value="' + a + '"/>';
    elemento += '<label  id="radio' + a + '">Editar Opcion</label>'; //Label de Radio
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/>'; //Boton para Eliminar Elemento
    elemento += '<br><script type="text/javascript"> jQuery("#radio' + a + '").editable();'; //Funcion Para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div></div>'; //Funcion para Eliminar Elemento
    elemento += '<img class="nueva-opcion" id="agregar' + b + '" width="15" height="13" src="../../Styles/Images/Add.png"/>'; //Boton para Agregar Opcion

    elemento += '<script type="text/javascript">jQuery("#agregar' + b + '").live("click", function () {';
    elemento += 'agregarOpcionRadio('+ b + ');})</script>';
    jQuery('#sortable').append('<li id="pieza' + b + '">' + elemento + '</li>');
});

//Control de Nueva Lista de CheckBox

jQuery('#objeto7').live("click", function () {
    var a = jQuery("#contador:hidden").val();
    a++;
    document.getElementById('contador').value = a;
    var b = jQuery("#contador:hidden").val();
    var elemento = '<div class="etiqueta-radio" id="nuevo' + a + '">Click para Editar </div>';
    elemento += '<img id="quitar' + b + '"  width="15" height="13" src="../../Styles/Images/Delete.png"/>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#nuevo' + a + '").editable();';
    elemento += 'jQuery("#quitar' + b + '").live("click", function () {jQuery("#pieza' + b + '").remove();});</script>'; //Funcion para Eliminar Elemento
    a++;
    //Opcion 1
    document.getElementById('contador').value = a;
    elemento += '<div class="bloques" id="bloques' + b + '"><div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div><input type="checkbox"   name="edicion' + b + '[]" value="' + a + '"/>';
    elemento += '<label  id="checkbox' + a + '">Editar Opcion</label>'; //Label de CheckBox
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript"> jQuery("#checkbox' + a + '").editable();'; //Funcion para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div>'; //Funcion para Eliminar Elemento
    a++;
    //Opcion 2
    document.getElementById('contador').value = a;
    elemento += '<div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div><input type="checkbox"   name="edicion' + b + '[]" value="' + a + '"/>';
    elemento += '<label  id="checkbox' + a + '">Editar Opcion</label>'; //Label de CheckBox
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript"> jQuery("#checkbox' + a + '").editable();'; //Funcion para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div>'; //Funcion para Eliminar Elemento
    a++;
    //Opcion 3
    document.getElementById('contador').value = a;
    elemento += '<div id="pieza' + a + '"><div class="etiqueta">&nbsp;</div><input type="checkbox"    name="edicion' + b + '[]" value="' + a + '"/>';
    elemento += '<label  id="checkbox' + a + '">Editar Opcion</label>'; //Label de CheckBox
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript"> jQuery("#checkbox' + a + '").editable();'; //Funcion para Editar Label
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div></div>'; //Funcion para Eliminar Elemento
    elemento += '<img class="nueva-opcion" id="agregar' + b + '" width="15" height="13" src="../../Styles/Images/Add.png"/>'; //Boton para Agregar Opcion

    elemento += '<script type="text/javascript">jQuery("#agregar' + b + '").live("click", function () {';
    elemento += 'agregarOpcionCheck(' + b + ');})</script>';
    jQuery('#sortable').append('<li id="pieza' + b + '">' + elemento + '</li>');
});

//Control de Nueva Carga de Archivo
jQuery('#objeto8').live("click", function () {
    var a = jQuery("#contador:hidden").val();
    a++;
    document.getElementById('contador').value = a;
    var elemento = '<div class="etiqueta" id="nuevo' + a + '">Click para Editar </div><input  type="file" name="edicionx" class="campoBajo"/>';
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#nuevo' + a + '").editable();';
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div>'; //Funcion para Eliminar Elemento
    jQuery('#sortable').append('<li id="pieza' + a + '">' + elemento + '</li>');
});

//Control de Nueva Area de Texto
jQuery('#objeto9').live("click", function () {
    var a = jQuery("#contador:hidden").val();
    a++;
    document.getElementById('contador').value = a;
    var elemento = '<div class="etiqueta" id="nuevo' + a + '">Click para Editar </div><textarea  name="ediciony" class="campoMedio"></textarea> ';
    elemento += '<img id="quitar' + a + '" width="15" height="13" src="../../Styles/Images/Delete.png"/><br>'; //Boton para Eliminar Elemento
    elemento += '<script type="text/javascript">jQuery("#nuevo' + a + '").editable();';
    elemento += 'jQuery("#quitar' + a + '").live("click", function () {jQuery("#pieza' + a + '").remove();});</script></div>'; //Funcion para Eliminar Elemento
    jQuery('#sortable').append('<li id="pieza' + a + '">' + elemento + '</li>');
});

//Funciones de Campos de Plantilla Existente

 jQuery("#quitarimpacto").live("click", function () { jQuery("#piezai").remove(); });
 jQuery("#quitarinnovacion").live("click", function () { jQuery("#piezain").remove(); });
 jQuery("#quitarresponsabilidad").live("click", function () { jQuery("#piezares").remove(); });